<template>
    <div>
        子应用 B详情 特有页面
        主应用数据：{{ v.name }}
        <button @click="msgParent">发送消息给主应用</button>
        <hr/>
        主应用返回数据：{{ resStr }}
    </div>
</template>
<script setup lang="ts">
import { ref } from 'vue'
const data = window.microApp.getData() // 返回主应用下发的data数据
console.log('data',data)
const v = ref(data)
const resStr = ref('')

const msgParent = () => {
    // forceDispatch
    window.microApp.dispatch({type: '子应用发送给主应用的数据'}, (res) => {
        console.log('res', res)
        resStr.value = res;
    })
}

window.microApp.addDataListener((data) => {
  console.log('来自主应用的数据1', data)
  resStr.value = '主应用：' + (typeof data === 'object'? JSON.stringify(data) : data.toString());
  return '返回值1'
})

// window.microApp.addDataListener((data) => {
//   console.log('来自主应用的数据2', data)

//   return '返回值2'
// })

</script>